<template>
    <el-drawer
        v-model="isShow"
        size="50%"
        :destroy-on-close="true"
        @close="closeHandle"
        :close-on-press-escape="false"
        :close-on-click-modal="false"
        :show-close="false"
    >
        <template #header="{ close, titleId, titleClass }">
            <h4 :id="titleId" :class="titleClass">{{ title }}</h4>
        </template>
        <el-form :model="form"  ref="formRef">
            <el-row class="mb-2" :gutter="20">
                <el-col class="tittle">
                  <div class="tittle_dian"></div><span >申请部门信息</span> 
                </el-col>
            </el-row>
            <el-row class="mb-2" :gutter="20">
                <el-col :span="12">
                    <el-form-item label="用警部门" required label-width="100px">
                        <el-select v-model="form.depId" @change="updateDepName" :disabled="isDisabled">
                            <el-option
                                v-for="item in deptOptions"
                                :key="item.deptId"
                                :label="item.deptName"
                                :value="item.deptId"
                            />
                        </el-select>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row class="mb-2" :gutter="20">
                <el-col :span="12">
                    <el-form-item label="联系人" required label-width="100px">
                        <el-input v-model="form.userLianxi" clearable :disabled="isDisabled" />
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="联系电话" required label-width="100px">
                        <el-input v-model="form.telLianxi" clearable  :disabled="isDisabled" />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row class="mb-2">
                <el-col class="tittle">
                  <div class="tittle_dian"></div><span >任务项信息</span> 
                </el-col>
            </el-row>
            <el-row class="mb-2" :gutter="20">
                <el-col :span="12" class="mb-2">
                    <el-form-item label="一级任务项" required label-width="100px">
                        <el-select v-model="form.tasktypeId" @change="updatetaskOption2" :disabled="isDisabled">
                            <el-option
                                v-for="item in taskOption"
                                :key="item.taskId"
                                :label="item.taskname"
                                :value="item.taskId"
                            />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="二级任务项" required label-width="100px">
                        <el-select v-model="form.tasktypeId2" :disabled="isDisabled">
                            <el-option
                                v-for="item in taskOption2"
                                :key="item.taskId"
                                :label="item.taskname"
                                :value="item.taskId"
                            />
                        </el-select>
                    </el-form-item>      
                </el-col>
                <el-col :span="24">
                    <el-form-item label="任务项备注" label-width="100px">
                        <el-input type="textarea" v-model="form.taskinfo"
                        :rows="1"
                        resize="none"
                        :disabled="isDisabled"
                        />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row class="mb-2">
                <el-col class="tittle">
                  <div class="tittle_dian"></div><span >用警要求</span> 
                </el-col>
            </el-row>
            <el-row class="mb-2" :gutter="20">
                <el-col :span="12" class="mb-2">
                    <el-form-item label="用警时间" required label-width="100px">
                        <el-date-picker
                            v-model="form.usedate"
                            type="datetime"
                            placeholder="请选择日期"
                            value-format="YYYY-MM-DD HH:mm:ss"
                            :disabled="isDisabled"
                            style="width:100%"
                        />
                    </el-form-item>
                </el-col>
                <el-col :span="12" class="mb-2">
                    <el-form-item label="用警人数" required >
                        <el-col :span="12">
                            <el-form-item label-position="left" label="男" required label-width="40px">
                                <el-input @input="validateNumber" maxlength="4" v-model="form.useman" style="width: 60px" :disabled="isDisabled" />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label-position="left" label="女" required label-width="40px">
                                <el-input @input="validateNumberusewoman" maxlength="4" v-model="form.usewoman" style="width: 60px" :disabled="isDisabled" />
                            </el-form-item>
                        </el-col>
                    </el-form-item>
                </el-col>
                <el-col :span="24" class="mb-2">
                    <el-form-item label="用警地点" required label-width="100px">
                        <el-input v-model="form.useaddress" style="width:100%"  :disabled="isDisabled"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12" class="mb-2 longtittle">
                    <el-form-item label="携带武器或器械要求" label-position="top">
                        <el-input v-model="form.armsorder" type="textarea" resize="none" :rows="3" style="width:100%" :disabled="isDisabled"/>
                    </el-form-item>
                </el-col>
                <el-col :span="12" class="mb-2 longtittle">
                    <el-form-item label="特别提示内容及要求"  label-position="top">
                        <el-input v-model="form.otherorder" type="textarea" resize="none" :rows="3"  style="width:100%" :disabled="isDisabled" />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row class="mb-2" v-if="isshowShenPiMsg">
                <el-col class="tittle">
                  <div class="tittle_dian"></div><span >申请审批意见</span> 
                </el-col>
            </el-row>
            <el-row :gutter="20" class="mb-2"  v-if="isshowShenPiMsg">
                <el-col :span="24">
                    <el-row class="rightrow2" :gutter="20">
                        <el-col :span="12" class="">
                            <el-form-item label="申请意见" label-width="140px">
                                <el-input v-model="form.applydetail" style="width:100%" :disabled="isDisabled" />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12" class="">
                            <el-form-item label="办案部门领导意见" required label-width="140px">
                                <el-input v-model="form.approvalDetail" style="width:100%" :disabled="isDisabled" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row class="rightrow2">
                        <el-col :span="24">
                            <el-form-item label="法警负责人意见" required label-width="140px">
                                <el-input v-model="form.fjdetail" style="width:100%" :disabled="isEditDepLeader" />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row class="rightrow2">
                        <el-col :span="24" class="">
                            <el-form-item label="分管领导意见" required label-width="140px">
                                <el-input v-model="form.leaderdetail" style="width:100%"  :disabled="isEditLeaderApprove"/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-col>
            </el-row>
            <el-row class="mb-2" v-if="isShowPaiJingMsg">
                <el-col class="tittle">
                  <div class="tittle_dian"></div><span >派警信息</span> 
                </el-col>
            </el-row>
            <el-row class="" v-if="isShowPaiJingMsg">
                <el-col :span="24" class="paijing">
                    <el-form-item label="派警" required label-width="140px">
                        <!-- 派警信息是在用警申请或者 直接派警的时候显示，并且可点击 -->
                        <el-select v-if="IfshowEelect" v-model="depConfirm.userlist" multiple placeholder="请选择"  @click="showEleectPolice">
                            <el-option
                            v-for="item in SelsecPeopleoptions"
                            :key="item.user_id"
                            :label="item.userName"
                            :value="item.user_id">
                            </el-option>
                        </el-select>
                        <el-select v-else v-model="depConfirm.userlist" disabled multiple>
                            <el-option
                            v-for="item in SelsecPeopleoptions"
                            :key="item.user_id"
                            :label="item.userName"
                            :value="item.user_id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="回退理由" v-if="isShowBackReason" required label-width="140px" style="padding: 5px 0;">
                        <el-input v-model="form.backreason" placeholder="请输入回退理由" style="width:100%" :disabled="isEditbackreason"/>
                    </el-form-item>
                </el-col>
            </el-row>
            <!-- 实施信息  -->
            <el-row class="mb-2" v-if="isShowSS">
                <el-col class="tittle">
                  <div class="tittle_dian"></div><span >实施信息 </span> 
                </el-col>
            </el-row>
            <el-row :gutter="20" v-if="isShowSS">
                <el-col :span="24">
                    <el-row>
                        <el-col :span="12" class="mb-2">
                            <el-form-item label="开始时间" required label-width="140">
                                <el-date-picker
                                    v-model="form.actdate"
                                    type="datetime"
                                    placeholder="请选择日期"
                                    value-format="YYYY-MM-DD HH:mm:ss"
                                    style="width:100%"
                                />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12" class="mb-2">
                            <el-form-item label="结束时间" required label-width="140">
                                <el-date-picker
                                    style="width:100%"
                                    v-model="form.enddate"
                                    type="datetime"
                                    placeholder="请选择日期"
                                    value-format="YYYY-MM-DD HH:mm:ss"
                                />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="实施情况" required label-width="140">
                                <el-input
                                type="textarea"
                                :rows="2"
                                resize="none"
                                 v-model="form.actdetail" placeholder="请输入实施情况" style="width:100%"/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-col>
            </el-row>
        </el-form>
        <template #footer>
            <template v-if="subBtn">
                <el-button type="primary" @click="submitHandle">提交</el-button>
            </template>
            <template v-if="isDepLeaderBtn">
                <el-button type="primary" @click="confirmAndDispatch">确认并派警</el-button>
                <el-button type="primary" @click="submitLeader" v-if="submitLeaderBtn">提交分管领导</el-button>
                <el-button type="primary" @click="submitBack" v-if="submitBackBtn">回退</el-button>
                <el-button type="primary" @click="applyCancel" v-if="applyCancelBtn">取消申请</el-button>
            </template>
           <template v-if="isLeaderApproveBtn">
                <el-button type="primary" @click="confirmshenhe">确认审批</el-button>
                <el-button type="primary" @click="submitBackLeader">回退</el-button>
            </template>
            <template v-if="isconfirmBtn">
                <el-button type="primary" @click="confirm">提交</el-button>
            </template>
            <template v-if="isSendPoliceconfirmBtn">
                <el-button type="primary" @click="SendPoliceconfirm">派警确认</el-button>
                <el-button type="primary" @click="SendPoliceconfirmBack">派警回退</el-button>
            </template>
            <template v-if="confirmRegistBtn">
                <el-button type="primary" @click="confirmRegist">确认登记</el-button>
                <el-button type="primary" @click="RegistSave">临时保存</el-button>
            </template>
            <el-button @click="isShow=false" style="margin-left:20px">关闭</el-button>
        </template>
    </el-drawer>
    <el-dialog
        v-model="isShowSelect"
        width="60%"
        style="height:620px"
        :destroy-on-close="true"
        >
        <template #header="{ close, titleClass }">
            <h4 :class="titleClass">选择派警人员</h4>
        </template>
        <SendPoliceSelect @userlist="userListV" :defaultChecked="depConfirm.userlist"></SendPoliceSelect>
    </el-dialog>
</template>

<script setup>
import {getCurrentInstance} from "vue";
import {getTaskList} from "@/api/task/task";
import { listDept } from "@/api/system/dept";
import { getUserProfile } from "@/api/system/user";
import {createUserPoliAppl,editUserPoliAppl,getUserPoliApplInfo,PoliceApplydepConfirm,PoliceApplyforLeader,
    PoliceApplycancel,PoliceApplyapplyCancel,PoliceApplyleaderConfirm,PoliceApplycancelLeaderConfirm} from "@/api/UserPoliAppl/UserPoliAppl";
import {getSendPoliceList,createSendPolice,batchEditSendPolice,getSendPoliceInfo,
    SendPoliceConfirm,SendPolicereturned,getSendPoliceConfirmInfo,SendPoliceregister} from "@/api/SendPolice/SendPolice";

import SendPoliceSelect from "@/components/SendPoliceSelect/SendPoliceSelect.vue";
const {proxy} = getCurrentInstance()
const {sys_normal_disable,nj_anjian_status} = proxy.useDict('sys_normal_disable', 'nj_anjian_status')
// 是否显示抽屉
const SelsecPeopleoptions = ref([])

const isShow = ref(false)
const isShowSelect = ref(false)

const rules = {
    depId: [{ required: true, message: "用警部门不能为空", trigger: "blur" }],
    userLianxi: [{ required: true, message: "联系人不能为空", trigger: "blur" }],
    telLianxi: [{ required: true, message: "联系电话不能为空", trigger: "blur" }],
    tasktypeId: [{ required: true, message: "一级任务项不能为空", trigger: "blur" }],
    tasktypeId2: [],
    usedate: [{ required: true, message: "用警时间不能为空", trigger: "blur" }],
    useman: [{ required: true, message: "用警人数不能为空", trigger: "blur" }],
    usewoman: [{ required: true, message: "用警人数不能为空", trigger: "blur" }],
    useaddress: [{ required: true, message: "用警地点不能为空", trigger: "blur" }],
    approvalDetail: [{ required: true, message: "办案部门审批领导意见不能为空", trigger: "blur" }],
    fjdetail: [{ required: true, message: "法警部门执行意见不能为空", trigger: "blur" }],
    leaderdetail: [{ required: true, message: "法警部门分管领导意见不能为空", trigger: "blur" }],
    userlist: [{ required: true, message: "", trigger: "blur" }],
    backreason: [{ required: true, message: "", trigger: "blur" }],
    actdate: [{ required: true, message: "", trigger: "blur" }],
    enddate: [{ required: true, message: "", trigger: "blur" }],
    actdetail: [{ required: true, message: "", trigger: "blur" }]
}

const isDisabled = ref(false)   //是否可编辑
const isshowShenPiMsg = ref(false)   //是否显示审批意见

const isEditDepLeader = ref(false)   //法警负责人审批意见是否可编辑true为不可编辑

const isEditLeaderApprove = ref(false)   //分管领导审批意见是否可编辑true为不可编辑
const isShowPaiJingMsg = ref(false)   //是否显示派警信息
const IfshowEelect = ref(true)   //是否显示可点击的选择派警人员input
const isShowBackReason = ref(false)   //是否显示回退理由
const isEditbackreason = ref(false)   //回退理由是否可编辑
const isShowSS = ref(false)   //是否显示实施信息

const subBtn = ref(true)   //是否显示 提交  按钮
const isDepLeaderBtn = ref(true)   //是否显示 部门领导 按钮
const submitLeaderBtn = ref(true)   //是否显示 法警负责人-提交给分管领导 按钮
const submitBackBtn = ref(true)   //是否显示 法警负责人-回退 按钮
const applyCancelBtn = ref(true)   //是否显示  法警负责人-取消 按钮

const isLeaderApproveBtn = ref(true)   //是否显示 分管领导 按钮
const isconfirmBtn = ref(true)   //是否显示 直接派警-确认 按钮
const isSendPoliceconfirmBtn = ref(true)   //是否显示 确认确认-反馈-按钮
const confirmRegistBtn = ref(true)   //是否显示 执行登记 按钮

// 显示派警信息
const defaultChecked = ref([])

// 抽屉标题
const title = ref('用警申请信息填写')
// 部门
const department = ref([])
// 所属单位
const deptOptions = ref([]);
const taskOption = ref([]);
const taskOption2 = ref([]);
const taskOptionAll = ref([]);

// 通知事件
const emit = defineEmits(['getUserPoliApplList'])

const changeShowStatus = () => {
    isShow.value = !isShow.value
}
const form = ref({
    depId:null,
    unitId:null,
    userLianxi:'',
    telLianxi:'',
    tasktypeId:'',
    tasktypeId2:'',
    taskinfo:'',
    usedate:'',
    usenum:'',
    useman: '',
    usewoman: '',
    useaddress:'',
    armsorder:'',
    otherorder:'',
    applydetail:'',
    approvalDetail:'同意',
    fjdetail:'',
    leaderdetail:'',
    actuserId:'',
    type:'',
    state:'0',
})
// 派警信息中派警人员列表信息
const depConfirm = ref({
    fjdetail:form.value.fjdetail,
    jw_policeapply_id:'',
    userlist:[]
})
const SendPoliceDataId = ref('')
const SendPoliceObjectId = ref('')
const SendPolicetype = ref('')

onMounted(() => {
    getTaskLists()
})

const getTaskLists = async (value) => {
    const TaskParams = {}
    const pageing = {
    pageNum: 1,
    pageSize: 999
    }
    await getTaskList(TaskParams,pageing).then(res => {
        taskOptionAll.value = res.rows
       taskOption.value = res.rows.filter(
        item => item.level === '1'
      );
      taskOption2.value = res.rows.filter(
        item => item.level === '2'
      );
    })
}
const updatetaskOption2 = async (value) => {
    form.value.tasktypeId2 = ''
    taskOption2.value = taskOptionAll.value.filter(
        item => item.fathertaskId === value
      );
}

const updateDepName = async (value) => {
    const selectedOption = deptOptions.value.find(item => item.deptId === value);
    form.value.depname = selectedOption ? selectedOption.deptName : '';
}

const getDepartment = async (unitId) => {
    const deptqueryParams = {}
    await listDept(deptqueryParams).then(res => {
        deptOptions.value = proxy.handleTree(
            res.data.filter(item => !item.isUnit && item.parentId === unitId),
            "deptId"
        );
    })
}

const showEleectPolice = async () => {
    isShowSelect.value = true
}
const showAddUsePoliAppl = async (formTypeV,tittleV) => {
    if(formTypeV == 1){
        title.value = tittleV
        isDisabled.value = false
        isDepLeaderBtn.value = false
        isLeaderApproveBtn.value = false
        isconfirmBtn.value = false
        isSendPoliceconfirmBtn.value = false
        confirmRegistBtn.value = false
        isshowShenPiMsg.value = true    //是否显示审批意见
        isEditDepLeader.value = true    //法警负责人审批意见是否可编辑true为不可编辑
        isEditLeaderApprove.value = true    //分管领导审批意见是否可编辑true为不可编辑
        try {
            const res = await getUserProfile();
            form.value.depId = res.data.deptId;
            form.value.unitId = res.data.unitId;
            form.value.unitname = res.data.unitName;
            form.value.depname = res.data.deptName;

            await getDepartment(form.value.unitId); 
            setTimeout(() => {
                changeShowStatus(); 
            }, 100);
        } catch (error) {
                console.error('An error occurred while fetching user profile or department data:', error);
            }
    }
        
    if(formTypeV == '4'){
        title.value = tittleV

        subBtn.value = false    //是否显示提交按钮
        isDepLeaderBtn.value = false    //是否显示法警负责人按钮
        submitLeaderBtn.value = false    //是否显示 法警负责人-提交给分管领导 按钮
        submitBackBtn.value = false    //是否显示 法警负责人-回退 按钮
        applyCancelBtn.value = false    //是否显示  法警负责人-取消 按钮
    
        isLeaderApproveBtn.value = false   //是否显示分管领导按钮
        isShowPaiJingMsg.value = true   //是否显示派警信息
        IfshowEelect.value = true   //是否显示可点击的选择派警人员input

        isconfirmBtn.value = true    //// 是否显示 直接派警-确认 按钮
        isSendPoliceconfirmBtn.value = false    ////是否显示 确认确认-反馈-按钮
        confirmRegistBtn.value = false    //是否显示执行登记按钮
        
        try {
            const res = await getUserProfile();

            form.value.depId = res.data.deptId;
            form.value.unitId = res.data.unitId;
            form.value.unitname = res.data.unitName;
            form.value.depname = res.data.deptName;

            await getDepartment(form.value.unitId); 
            setTimeout(() => {
                changeShowStatus(); 
            }, 100);
            
        } catch (error) {
            console.error('An error occurred while fetching user profile or department data:', error);
        }
    }
}

const showEditUsePoliAppl = async (data,tittleV,formTypeV,EditOrView) => {
    console.log(data,tittleV,formTypeV,EditOrView)
    if(formTypeV == '1'){
        if(data.state == '1' && EditOrView == 'Edit'){
            title.value = tittleV
            isDepLeaderBtn.value = false
            isLeaderApproveBtn.value = false
            isconfirmBtn.value = false   //是否显示 直接派警-确认 按钮
            isSendPoliceconfirmBtn.value = false
            confirmRegistBtn.value = false

        }
        if(EditOrView == 'View'){
            title.value = tittleV
            subBtn.value = false    //提交按钮
            isDisabled.value = true
            isDepLeaderBtn.value = false
            isLeaderApproveBtn.value = false
            isconfirmBtn.value = false   //是否显示 直接派警-确认 按钮
            isSendPoliceconfirmBtn.value = false
            confirmRegistBtn.value = false

            isshowShenPiMsg.value = true
            isShowPaiJingMsg.value = false
            isEditLeaderApprove.value = true //分管领导审批意见是否可编辑true为不可编辑
            isEditDepLeader.value = true
        }
        await getUserPoliApplInfo(data.jw_policeapply_id).then(res => {
            form.value = res.data
            form.value.depId = Number(res.data.depId)
            })
            // 回显用警部门中文label
        await listDept().then(res => {
            deptOptions.value = res.data.filter(
                item => !item.isUnit && item.parentId == data.unit_id
        );
        })
        changeShowStatus()
    }
    // 2为  法警负责人审批
    if( formTypeV == '2' ){
        if(data.state == 3 && EditOrView == 'Edit'){
            title.value = tittleV
            isDisabled.value = true    //上面信息是否可编辑
            subBtn.value = false    //是否显示提交按钮
            isDepLeaderBtn.value = true    //是否显示法警负责人按钮
            submitLeaderBtn.value = false    //是否显示 法警负责人-提交给分管领导 按钮
            submitBackBtn.value = false    //是否显示 法警负责人-回退 按钮
            applyCancelBtn.value = false    //是否显示  法警负责人-取消 按钮
           
            isLeaderApproveBtn.value = false   //是否显示分管领导按钮
            isShowPaiJingMsg.value = true   //是否显示派警信息
            IfshowEelect.value = true   //是否显示可点击的选择派警人员input

            isconfirmBtn.value = false    //是否显示 直接派警-确认 按钮
            isSendPoliceconfirmBtn.value = false    //是否显示 确认确认-反馈-按钮
            confirmRegistBtn.value = false    //是否显示执行登记按钮

            isshowShenPiMsg.value = true    //是否显示审批意见
            isEditDepLeader.value = false    //法警负责人审批意见是否可编辑true为不可编辑
            isEditLeaderApprove.value = true    //分管领导审批意见是否可编辑true为不可编辑

        }else if(data.state == 1 && EditOrView == 'Edit'){
            title.value = tittleV
            isDisabled.value = true    //上面信息是否可编辑
            subBtn.value = false    //是否显示提交按钮
            isDepLeaderBtn.value = true    //是否显示法警负责人按钮
            isLeaderApproveBtn.value = false    //是否显示部门领导按钮
            isconfirmBtn.value = false    //是否显示 直接派警-确认 按钮

            isShowPaiJingMsg.value = true   //是否显示派警信息
            IfshowEelect.value = true   //是否显示可点击的选择派警人员input

            isSendPoliceconfirmBtn.value = false    //是否显示 确认确认-反馈-按钮
            confirmRegistBtn.value = false    //是否显示执行登记按钮

            isshowShenPiMsg.value = true    //是否显示审批意见
            isEditDepLeader.value = false    //法警负责人审批意见是否可编辑true为不可编辑
            isEditLeaderApprove.value = true    //分管领导审批意见是否可编辑true为不可编辑
        }
        if( EditOrView == 'View'){
            console.log(11234)
            title.value = tittleV
            isDisabled.value = true    //上面信息是否可编辑
            subBtn.value = false    //是否显示提交按钮
            isDepLeaderBtn.value = false    //是否显示法警负责人按钮
            isLeaderApproveBtn.value = false    //是否显示部门领导按钮
            isconfirmBtn.value = false    //是否显示 直接派警-确认 按钮

            isShowPaiJingMsg.value = true   //是否显示派警信息
            IfshowEelect.value = false   //是否显示可点击的选择派警人员input

            isSendPoliceconfirmBtn.value = false    //是否显示 确认确认-反馈-按钮
            confirmRegistBtn.value = false    //是否显示执行登记按钮


            isshowShenPiMsg.value = true    //是否显示审批意见
            isEditDepLeader.value = true    //法警负责人审批意见是否可编辑true为不可编辑
            isEditLeaderApprove.value = true    //分管领导审批意见是否可编辑true为不可编辑
        }

        depConfirm.value.jw_policeapply_id = data.jw_policeapply_id
        const bodydata = {objectId:data.jw_policeapply_id}
        const paging = {pageNum: 1,pageSize: 99}
        // 根据用警申请ID，获取对应的用警人员列表
        await getSendPoliceList(bodydata,paging).then(res => {
            SelsecPeopleoptions.value = res.rows
            depConfirm.value.userlist = res.rows.map(item => item.user_id)  //为了给选择人员组件传参
        })
        // 根据ID获取派警信息详情
        await getUserPoliApplInfo(data.jw_policeapply_id).then(res => {
            form.value = res.data
            if(form.value.fjdetail == '' &&  EditOrView == 'Edit'){
                form.value.fjdetail = '同意'
            }
            form.value.depId = Number(res.data.depId)
            })
            // 回显用警部门中文label
        await listDept().then(res => {
            deptOptions.value = res.data.filter(
                item => !item.isUnit && item.parentId == data.unit_id
        );
        })
        // 以下是控制一些 可编辑不可编辑等状态
        
        
        changeShowStatus()
    }
    // 3为分管领导审批
    if(formTypeV == '3'){
       
       if(EditOrView == 'Edit'){
        title.value = tittleV

        form.value.leaderdetail  = '同意'

        isDisabled.value = true    //上面信息是否可编辑
        subBtn.value = false    //是否显示提交按钮
        isDepLeaderBtn.value = false    //是否显示法警负责人按钮
        isLeaderApproveBtn.value = true     //是否显示部门领导按钮
        isconfirmBtn.value = false    //是否显示 直接派警-确认 按钮
        isSendPoliceconfirmBtn.value = false    //是否显示直接派警按钮
        confirmRegistBtn.value = false    //是否显示执行登记按钮

        isshowShenPiMsg.value = true    //是否显示审批意见
        isEditDepLeader.value = true    //法警负责人审批意见是否可编辑true为不可编辑
        isEditLeaderApprove.value = false   //分管领导审批意见是否可编辑true为不可编辑

        isShowPaiJingMsg.value = false   //是否显示派警信息
        IfshowEelect.value = false   //是否显示可点击的选择派警人员input
       }

       if(EditOrView == 'View'){
        title.value = tittleV

        isDisabled.value = true    //上面信息是否可编辑
        subBtn.value = false    //是否显示提交按钮
        isDepLeaderBtn.value = false    //是否显示法警负责人按钮
        isLeaderApproveBtn.value = false     //是否显示部门领导按钮
        isconfirmBtn.value = false    //是否显示 直接派警-确认 按钮
        isSendPoliceconfirmBtn.value = false    //是否显示直接派警按钮
        confirmRegistBtn.value = false    //是否显示执行登记按钮

        isshowShenPiMsg.value = true    //是否显示审批意见
        isEditDepLeader.value = true    //法警负责人审批意见是否可编辑true为不可编辑
        isEditLeaderApprove.value = true    //分管领导审批意见是否可编辑true为不可编辑

        isShowPaiJingMsg.value = false   //是否显示派警信息
        IfshowEelect.value = false   //是否显示可点击的选择派警人员input
       }
        

        depConfirm.value.jw_policeapply_id = data.jw_policeapply_id
        const bodydata = {objectId:data.jw_policeapply_id}
        const paging = {pageNum: 1,pageSize: 99}
        // 根据用警申请ID，获取对应的用警人员列表
        await getUserPoliApplInfo(data.jw_policeapply_id).then(res => {
            form.value = res.data
            form.value.depId = Number(res.data.depId)
            })
        await listDept().then(res => {
            deptOptions.value = res.data.filter(
                item => !item.isUnit && item.parentId == data.unit_id
        );
        })
        
        changeShowStatus()
    }
    // 4为直接派警
    if(formTypeV == '4'){
        if(EditOrView == 'Edit'){
            title.value = tittleV

            subBtn.value = false    //是否显示提交按钮
            isDepLeaderBtn.value = false    //是否显示法警负责人按钮
            submitLeaderBtn.value = false    //是否显示 法警负责人-提交给分管领导 按钮
            submitBackBtn.value = false    //是否显示 法警负责人-回退 按钮
            applyCancelBtn.value = false    //是否显示  法警负责人-取消 按钮

            isLeaderApproveBtn.value = false   //是否显示分管领导按钮
            isShowPaiJingMsg.value = true   //是否显示派警信息
            IfshowEelect.value = true   //是否显示可点击的选择派警人员input

            isconfirmBtn.value = true    //// 是否显示 直接派警-确认 按钮
            isSendPoliceconfirmBtn.value = false    ////是否显示 -当事人-反馈-按钮
            confirmRegistBtn.value = false    //是否显示执行登记按钮
        }
        if(EditOrView == 'View'){
            title.value = tittleV
            isDisabled.value = true
            subBtn.value = false    //是否显示提交按钮
            isDepLeaderBtn.value = false    //是否显示法警负责人按钮
            submitLeaderBtn.value = false    //是否显示 法警负责人-提交给分管领导 按钮
            submitBackBtn.value = false    //是否显示 法警负责人-回退 按钮
            applyCancelBtn.value = false    //是否显示  法警负责人-取消 按钮

            isLeaderApproveBtn.value = false   //是否显示分管领导按钮
            isShowPaiJingMsg.value = true   //是否显示派警信息
            IfshowEelect.value = false   //是否显示可点击的选择派警人员input

            isconfirmBtn.value = true    //// 是否显示 直接派警-确认 按钮
            isSendPoliceconfirmBtn.value = false    ////是否显示 -当事人-反馈-按钮
            confirmRegistBtn.value = false    //是否显示执行登记按钮
            isShowBackReason.value = true   //是否显示回退理由
        isEditbackreason.value = true    //回退理由是否可编辑

        }

        SendPoliceDataId.value = data.jw_sendpolice_id      //批量修改修改的时候传的jwPoliceApplyId值
        const bodydata = {objectId:data.object_id}
        const paging = {pageNum: 1,pageSize: 99}
        // // 根据用警申请ID，获取对应的用警人员列表
        await getSendPoliceList(bodydata,paging).then(res => {
            SelsecPeopleoptions.value = res.rows
            depConfirm.value.userlist = res.rows.map(item => item.user_id)  //为了给选择人员组件传参
        })
        
        
        const userInfo = await getUserPoliApplInfo(data.object_id);
        form.value = userInfo.data;
        form.value.depId = Number(userInfo.data.depId)
        await getSendPoliceInfo(data.jw_sendpolice_id).then(res => {
             form.value.backreason = res.data.backreason
        })
        const unitId = userInfo.data.unitId; // 存储 unitId
        const deptResponse = await listDept();
        deptOptions.value = deptResponse.data.filter(item => 
            !item.isUnit && item.parentId == unitId // 使用获取的 unitId
        );
        changeShowStatus()
    }
// 5为用户的派警确认
if(formTypeV == '5'){
    if(EditOrView == 'Edit'){
        title.value = tittleV

        isDisabled.value = true
        subBtn.value = false    //是否显示提交按钮
        isDepLeaderBtn.value = false    //是否显示法警负责人按钮
        submitLeaderBtn.value = false    //是否显示 法警负责人-提交给分管领导 按钮
        submitBackBtn.value = false    //是否显示 法警负责人-回退 按钮
        applyCancelBtn.value = false    //是否显示  法警负责人-取消 按钮
    
        isLeaderApproveBtn.value = false   //是否显示分管领导按钮
        isShowPaiJingMsg.value = true   //是否显示派警信息
        IfshowEelect.value = false   //是否显示可点击的选择派警人员input
        isShowBackReason.value = true   //是否显示回退理由
        
        isconfirmBtn.value = false //// 是否显示 直接派警-确认 按钮
        isSendPoliceconfirmBtn.value = true    ////是否显示 -当事人-反馈-按钮
        confirmRegistBtn.value = false    //是否显示执行登记按钮
        isShowBackReason.value = true   //是否显示回退理由
        isEditbackreason.value = false    //回退理由是否可编辑
    }
    if(EditOrView == 'View'){
        title.value = tittleV

        isDisabled.value = true
        subBtn.value = false    //是否显示提交按钮
        isDepLeaderBtn.value = false    //是否显示法警负责人按钮
        submitLeaderBtn.value = false    //是否显示 法警负责人-提交给分管领导 按钮
        submitBackBtn.value = false    //是否显示 法警负责人-回退 按钮
        applyCancelBtn.value = false    //是否显示  法警负责人-取消 按钮
    
        isLeaderApproveBtn.value = false   //是否显示分管领导按钮
        isShowPaiJingMsg.value = true   //是否显示派警信息
        IfshowEelect.value = false   //是否显示可点击的选择派警人员input
        isShowBackReason.value = true   //是否显示回退理由
        
        isconfirmBtn.value = false //// 是否显示 直接派警-确认 按钮
        isSendPoliceconfirmBtn.value = false    ////是否显示 -当事人-反馈-按钮
        confirmRegistBtn.value = false    //是否显示执行登记按钮
        isEditbackreason.value = true    //回退理由是否可编辑
    }   


    SendPoliceDataId.value = data.jw_sendpolice_id
    const bodydata = {objectId:data.object_id}
        const paging = {pageNum: 1,pageSize: 99}
        // 根据用警申请ID，获取对应的用警人员列表
        await getSendPoliceList(bodydata,paging).then(res => {
            SelsecPeopleoptions.value = res.rows
            depConfirm.value.userlist = res.rows.map(item => item.user_id)  //为了给选择人员组件传参
        })
        const userInfo = await getUserPoliApplInfo(data.object_id);
        form.value = userInfo.data;
        form.value.depId = Number(userInfo.data.depId)
        const unitId = userInfo.data.unitId; // 存储 unitId
        const deptResponse = await listDept();
        deptOptions.value = deptResponse.data.filter(item => 
            !item.isUnit && item.parentId == unitId // 使用获取的 unitId
        );

        changeShowStatus()
    }

    // 6为用户的执行警务登记--确认登记
if(formTypeV == '6'){
   
    title.value = tittleV

    isDisabled.value = true
    subBtn.value = false    //是否显示提交按钮
    isDepLeaderBtn.value = false    //是否显示法警负责人按钮
    submitLeaderBtn.value = false    //是否显示 法警负责人-提交给分管领导 按钮
    submitBackBtn.value = false    //是否显示 法警负责人-回退 按钮
    applyCancelBtn.value = false    //是否显示  法警负责人-取消 按钮

    isLeaderApproveBtn.value = false   //是否显示分管领导按钮
    isShowPaiJingMsg.value = false   //是否显示派警信息
    IfshowEelect.value = false   //是否显示可点击的选择派警人员input
    isShowBackReason.value = false   //是否显示回退理由
    
    isconfirmBtn.value = false //// 是否显示 直接派警-确认 按钮
    isSendPoliceconfirmBtn.value = false    ////是否显示 -当事人-反馈-按钮
    confirmRegistBtn.value = true    //是否显示执行登记按钮
    confirmRegistBtn.value = false    //是否显示执行登记按钮
        
        isshowShenPiMsg.value = true    //是否显示审批意见
        isEditDepLeader.value = true    //法警负责人审批意见是否可编辑true为不可编辑
        isEditLeaderApprove.value = true   //分管领导审批意见是否可编辑true为不可编辑

        isShowSS.value = true   //分管领导审批意见是否可编辑true为不可编辑
        
        confirmRegistBtn.value = true   //是否显示 执行登记 按钮


    const bodydata = {objectId:data.objectId}
    const paging = {pageNum: 1,pageSize: 99}
   
    console.log(data)
    const userInfo = await getUserPoliApplInfo(data.objectId);
    form.value = userInfo.data;
    form.value.depId = Number(userInfo.data.depId)
    const unitId = userInfo.data.unitId; // 存储 unitId
    const deptResponse = await listDept();
    deptOptions.value = deptResponse.data.filter(item => 
        !item.isUnit && item.parentId == unitId // 使用获取的 unitId
    );
    // 根据jwSendPoliceId派警单ID获取派警单详情
    await getSendPoliceConfirmInfo(data.jwSendPoliceId).then(res => {
        form.value.actdate = res.data.actdate
        form.value.enddate = res.data.enddate
        form.value.actdetail = res.data.actdetail
        SendPolicetype.value = res.data.type
        SendPoliceDataId.value = res.data.jwSendpoliceId
        SendPoliceObjectId.value = res.data.objectId
    })
    changeShowStatus()
    }

    
}
defineExpose({showAddUsePoliAppl,showEditUsePoliAppl,})

const  validateNumber = () => {
  // 只保留数字和空字符串
  form.value.useman = form.value.useman.replace(/[^0-9]/g, '');
}
const  validateNumberusewoman = () => {
  // 只保留数字和空字符串
  form.value.usewoman = form.value.usewoman.replace(/[^0-9]/g, '');
}
const defaultQuery = {
    depId:null,
    userLianxi:'',
    telLianxi:'',
    tasktypeId:'',
    tasktypeId2:'',
    taskinfo:'',
    usedate:'',
    usenum:'',
    useman: '',
    usewoman: '',
    useaddress:'',
    armsorder:'',
    otherorder:'',
    applydetail:'',
    approvalDetail:'同意',
    fjdetail:'',
    leaderdetail:'',
    actuserId:'',
    state:'1',

}

const submitHandle = async () => {
    if (form.value['jwPoliceapplyId']) {
            form.value.usenum =  Number(form.value.useman) + Number(form.value.usewoman)
             editUserPoliAppl(form.value).then(res => {
                changeShowStatus()
                emit('getUserPoliApplList', '来了老弟')
            })
        } else {
            form.value.usenum =  Number(form.value.useman) + Number(form.value.usewoman)
             createUserPoliAppl(form.value).then(res => {
                changeShowStatus()
                emit('getUserPoliApplList', '来了老弟')
            })
        }
// 必输校验--标签<el-form :model="form" label-width="auto" ref="formRef"  :rules="rules"> 添加ref="formRef" 属性 :rules="rules"绑定
// 然后const rules = {里面是需要的rules}   在每个<el-form-item label="房间编号" required prop="对应字段">加上 prop="对应的字段"
            // submitHandle的时候先判断    proxy.$refs["formRef"].validate(valid => {
        // if (valid) {  valid true面执行具体代码逻辑     });}
// if (taskOption2.value) {
//     rules.tasktypeId2 = [{ required: true, message: "二级任务项不能为空", trigger: "blur" }];
//     proxy.$refs["formRef"].validate(valid => {
//         if (valid) {
//             console.log(3333)
        
//         }
//     })
// }else{
//     console.log(22)
// }
}

// 确认并派警
const confirmAndDispatch = async () => {
    depConfirm.value.fjdetail = form.value.fjdetail
    await PoliceApplydepConfirm(depConfirm.value).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
}
// 分管领导-确认审批
const confirmshenhe = async () => {
    depConfirm.value.fjdetail = form.value.leaderdetail
        depConfirm.value.userlist = depConfirm.value.userlist
        await PoliceApplyleaderConfirm(depConfirm.value).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
}
// 直接派警
const confirm = async () => {
    if(form.value['jwPoliceapplyId']){
        const SendPoliceData = {
            jwSendPoliceId:SendPoliceDataId.value,
            userlist:depConfirm.value.userlist
        }
        await batchEditSendPolice(SendPoliceData).then(res => {
                emit('getUserPoliApplList', '来了老弟')
        })
    }else{
        form.value.approvalDetail = "同意"
        const SendPoliceData = {
            jwPoliceapply:form.value,
            userlist:depConfirm.value.userlist
        }
        form.value.usenum =  Number(form.value.useman) + Number(form.value.usewoman)
        await createSendPolice(SendPoliceData).then(res => {
                emit('getUserPoliApplList', '来了老弟')
        })
    }
    changeShowStatus()
}
// 提交给分管领导
const submitLeader = async () => {
    depConfirm.value.fjdetail = form.value.fjdetail
    await PoliceApplyforLeader(depConfirm.value).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
}
// 回退
// 法警负责人时执行法警负责人回退
const submitBack = async () => {
    depConfirm.value.fjdetail = form.value.fjdetail
    // 来源是2(法警负责人时执行法警负责人回退)
        await PoliceApplycancel(depConfirm.value).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
    }
// 分管领导-回退
const submitBackLeader = async () => {
    depConfirm.value.fjdetail = form.value.fjdetail
    await PoliceApplycancelLeaderConfirm(depConfirm.value).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
}

const SendPoliceconfirm = async () => {
    await SendPoliceConfirm(SendPoliceDataId.value).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
}
const SendPoliceconfirmBack = async () => {
    if(form.value.backreason == '' || form.value.backreason == null){
        proxy.$modal.msgError("请填写回退理由");
    }else{
        const data = {
            jwSendpoliceId:SendPoliceDataId.value,
            backreason:form.value.backreason
        }
        await SendPolicereturned(data).then(res => {
            changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
    }
}
//取消
const applyCancel = async () => {
    console.log(formType.value)
    depConfirm.value.fjdetail = form.value.fjdetail
    await PoliceApplyapplyCancel(depConfirm.value).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
}
//执行警务登记-确认登记
const confirmRegist = async () => {
    const data ={
        actdate:form.value.actdate,
        enddate:form.value.enddate,
        actdetail:form.value.actdetail,
        jwSendPoliceId:SendPoliceDataId.value,
        objectId:SendPoliceObjectId.value,
        type:SendPolicetype.value,
        
        isTemp:false
    }
    await SendPoliceregister(data).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
}
//临时保存
const RegistSave = async () => {
    const data ={
        actdate:form.value.actdate,
        enddate:form.value.enddate,
        actdetail:form.value.actdetail,
        jwSendPoliceId:SendPoliceDataId.value,
        objectId:SendPoliceObjectId.value,
        type:SendPolicetype.value,
        isTemp:true
    }
    console.log(data)
    await SendPoliceregister(data).then(res => {
        changeShowStatus()
        emit('getUserPoliApplList', '来了老弟')
    })
}


const userListV = (data) => {
    console.log(data)
    SelsecPeopleoptions.value = data
    depConfirm.value.userlist = data.map(item => item.user_id)
    console.log(depConfirm.value.userlist)
    // depConfirm.value.userlist = String(depConfirm.value.userlist)
    
    isShowSelect.value = false
}
// 关闭后的回调事件
const closeHandle = () => {
    form.value = defaultQuery
    depConfirm.value.userlist = []
    console.log(123123)
}
</script>

<style lang="scss" scoped>
h4{margin:0;}

.el-drawer :deep().el-drawer__body{padding:10px 5px}

.el-form-item{margin-bottom: 0;}

.paijing :deep() .el-tag .el-tag__close{display:none}

.el-row-border{border: 1px solid #ebeef5;}
.lefttittle{background:#f5f7fa;border-right: 1px solid #ebeef5 ;display: flex;display: -webkit-flex;
align-items: center;justify-content: center; /* 垂直居中 */}
.rightrow{padding: 5px 0;border-bottom:1px solid #ebeef5  ;}
.rightrow2{padding: 5px 0;}


.rightrowtittle{line-height: 32px;}
.longtittle :deep().el-form-item--default .el-form-item__label{line-height: 18px;}

// .longtittle{display: flex;display: -webkit-flex;align-items: center;}
.longtittle .el-form-item--default .el-form-item__label{line-height: 18px;}

.paijing :deep().el-select{width:100%}
.paijing :deep().el-select__wrapper {width: 100%;}

.tittle {display: flex;display: inline-flex;align-items: center;color: #0077B9;}
.tittle_dian{width: 5px;height: 16px;margin-right: 10px;background: #0077B9;}

</style>